<template>
	<view class="img_view"
		:style="{ backgroundColor: bgColor, borderRadius: `${rounded}rpx`, width: `${size}rpx`, height: `${size}rpx` }">
		<image v-if="img" :src="img" mode="aspectFill" />
		<uv-icon v-else name="account-fill" size="24" :color="iconColor" />
	</view>
</template>

<script>
	export default {
		props: {
			img: {
				type: String,
				default: '',
			},
			size: {
				type: Number,
				default: 70,
			},

			// 圆角
			rounded: {
				type: Number,
				default: 20,
			},
			bgColor: {
				type: String,
				default: '#999',
			},
			iconColor: {
				type: String,
				default: '#eee',
			},
		},
		data() {
			return {

			}
		}
	}
</script>

<style scoped>
	.img_view {
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
		overflow: hidden;
	}

	.img_view image {
		width: 100%;
		height: 100%;
	}
</style>